<template>
	<view>
		<view class="page_title">
		  <nav-back></nav-back>
		  <view class="page_name">房产认证</view>
		  <view class="blank"></view>
		</view>
		
		
		<view class="banxin auth">
		  <view v-if="authStatus==1">
		    <view class="why">
		      房产认证
		    </view>
		    <view class="info">
		      请如实填写房产认证信息
		    </view>
		  </view>
		  <view  v-if="authStatus==0">
		    <view class="why">
		      <image src="/static/img/auth_success.png" mode=""/>
		      已认证
		    </view>
		    <view class="info">
		      您已于{{authTime}} 提交了房产认证
		    </view>
		  </view>
		  <view  v-if="authStatus==2">
		    <view class="why">
		      <image src="/static/img/auth_pending.png" mode=""/>
		      审核中
		    </view>
		    <view class="info">
		      您已于{{authTime}}  提交了房产认证
		    </view>
		  </view>
		  <view  v-if="authStatus==3">
		    <view class="why">
		      <image src="/static/img/auth_fail.png" mode=""/>
		      未通过
		    </view>
		    <view class="info">
		      未通过原因：产证看不清，请重新提交
		    </view>
		  </view>
		  <view class="income">
		    <view class="label">
		      <text>上传房产证照片</text>  
		    </view>
		    <view >
		      <image @click="handleUpload" class="choose" :src="fileUrl?fileUrl:'/static/img/choose.png'" mode=""/>
		    </view>
		  </view>
		  <view class="tip2">
		    <image src="/static/img/tip.png" mode=""/>
		    <text>房产证照片的产证封面、内页必须完整清晰可见；
		    产证产权人必须包含您实名认证中的姓；
		    产证资料仅供平台审核，未经您的允许不会对外公开。</text>
		  </view>
		  <button v-if="authStatus==1||authStatus==3" class="next" type="primary" @click="handleSubmit">提交审核</button>
		</view>
	</view>
</template>

<script>
	import request from '@/utils/request.js'
	import NavBack from '@/components/NavBack.vue'

	export default {
		components: {
			NavBack
		},
		data() {
			return {
				authStatus:0,
				authTime:'',
				fileUrl:'/static/img/choose.png',
				uploadFile:'',
			};
		},
		 onLoad() {
		    let that = this
		    request(`/employee/${uni.getStorageSync('id')}`).then((res)=>{
		      console.log(res.data.data.authentication,'authentication');
		      let authentication = res.data.data.authentication
				that.authStatus = authentication.buildingStatus
				that.authTime = authentication.buildingTime
				that.fileUrl = authentication.buildingUrl
		    })
		  },
		methods:{
			// 假设blob是一个图片的Blob对象
			blobToBase64(blob, callback) {
				// 创建FileReader对象
				let reader = new FileReader();
				reader.onload = function(e) {
					// 当读取操作完成时，调用callback函数并传入转换后的base64字符串
					callback(e.target.result);
				};
				reader.readAsDataURL(blob);
			},
			 handleUpload(){
			    if(this.authStatus==0||this.authStatus==2){
			      return
			    }
			    let that = this
			   uni.chooseImage({
			   	count: 1,
			   	mediaType: ['mix'],
			   	sourceType: ['album'],
			   	maxDuration: 30,
			   	camera: 'front',
			   	success(res) {
			   		// uni.showLoading({
			   		//   title: '加载中',
			   		// });
			   		that.fileUrl = res.tempFilePaths[0]
			   		console.log(res.tempFilePaths, 'res')
			   		// 预览图片
			   		let xhr = new XMLHttpRequest();
			   		xhr.open('GET', res.tempFilePaths[0], true);
			   		xhr.responseType = 'blob';
			   		xhr.onload = function() {
			   			if (this.status == 200) {
			   				let blob = this.response;
			   				console.log(this.response,'this.response');
			   				// 调用转换函数
			   				that.blobToBase64(blob, function(base64) {
			   					console.log('Base64:', base64.slice(23));
			   					// 此处可以使用base64，例如赋值给img的src或者其他用途
			   					that.uploadFile = base64.slice(23)
			   				});
			   			}
			   		};
			   		xhr.send();
			   	}
			   })
			  },
			  handleSubmit(){
			    if(!this.uploadFile){
			      uni.showToast({
			        title: '请上传房产证照片',
			        icon: 'none',
			        duration: 2000
			      })
			      return
			    }
			    uni.showLoading({
			      title: '加载中',
			    });
			    let that = this
			    request(`/sms/houseAuthenticate`,{
			      method:'POST',
			      data:{
			        base64Data:this.uploadFile,
			      }
			    }).then(((res)=>{
			      console.log(res.data,'res');
			      if(res.data.code==1){
			        uni.showToast({
			          title: '已提交审核，请耐心等待，或联系红娘为您快速处理',
			          icon: 'none',
			          duration: 2000
			        })
			        that.authStatus = 2
			      }
			    }))
			  },
		}
	}
</script>

<style lang="scss">

@import "@/style/auth.scss";

.income{
  overflow: hidden;
  margin-top: 40rpx;
  .label,.tip{
    display: flex;
    justify-content: space-between;
  }
  .choose{
    width: 140rpx;
    height: 140rpx;
    text-align: center;
    margin-top: 30rpx;
    overflow: hidden;
    // image{
    //   height: 140rpx;
    //   margin: 0 auto;
    // }
  }
}
.tip2{
  display: flex;
  align-items: flex-start;
  image{
    margin-top: -75rpx;
    margin-right: 50rpx;
  }
}
</style>
